<form lay-filter="inquiryOrderInformationForm" id="inquiryOrderInformationForm" class="layui-form model-form"
      style="padding: 5px 30px 0 30px;height: calc(100% - 5px);overflow: hidden;">
    <div class="open-details-box"
         style="height: calc(100% - 100px); padding-top: 20px;overflow: auto;margin-bottom: 20px">
        <div class="layui-form-item layui-row">
            <input name="id" type="hidden"/>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">客户名称</label>
                <div class="layui-input-inline">
                    <select id="customerId" name="customerId" lay-filter="customerId" lay-verify="required"
                            lay-search="">
                    </select>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">客户联系人</label>
                <div class="layui-input-inline">
                    <select id="customerContactsId" name="customerContactsId" lay-filter="customerContactsId"
                            lay-search=""></select>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">联系人电话</label>
                <div class="layui-input-inline">
                    <input name="telephone" id="telephone" disabled class="layui-input" type="text"
                           placeholder="请输入联系人电话"
                           lay-verify="numbers"/>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">交货时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="deliveryTime" placeholder="交货时间"
                           lay-verify="required" name="deliveryTime">
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">所属渠道</label>
                <div class="layui-input-inline">
                    <input class="layui-input" id="agentName" name="agentName" lay-search=""/>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">订单类型</label>
                <div class="layui-input-inline">
                    <select name="orderType" lay-verify="required" disabled>
                        <!--                            <option value="proff">打样订单</option>-->
                        <option value="trial">试产订单</option>
                        <!--                            <option value="mass">量产订单</option>-->
                    </select>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <input name="checkerName" type="hidden"/>
                <label class="layui-form-label">询价审核人</label>
                <div class="layui-input-inline">
                    <select id="checkerId" name="checkerId" lay-verify="required" lay-filter="checkerId"
                            lay-search=""></select>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">订单来源</label>
                <div class="layui-input-inline">
                    <select name="orderSource">
                        <option value="staff">自主录入/员工录入</option>
                        <option value="platform">云端制造/平台指派</option>
                        <option value="agent">渠道录入/代理商录入</option>
                        <option value="customer">云端智采/客户直接委派</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline layui-col-md3">
                <label class="layui-form-label">报价截止时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="offerEndTime" placeholder="交货时间"
                           lay-verify="required" name="offerEndTime">
                </div>
            </div>
            <div class="layui-inline layui-col-md3" id="contractIdBox" style="display:none;">
                <label class="layui-form-label">选择合同</label>
                <div class="layui-input-inline">
                    <select name="contractId" lay-filter="contractId" lay-verify="required" lay-search=""></select>
                </div>
                <div class="layui-word-aux layui-form-mid">
                    <button class="layui-btn layui-btn-xs" id="contractIdAddBtn">添加</button>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn " type="button" id="Configure">配置物料信息</button>

            <table class="layui-table" id="inquiryOrderInformationTable"
                   lay-filter="inquiryOrderInformationTable"></table>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注说明</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入内容" class="layui-textarea" style="resize: none" name="remark"></textarea>
            </div>

        </div>
    </div>
    <div class="layui-form-item text-right">
        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        <button class="layui-btn" lay-filter="inquiryOrderInformationSubmit" type="button" lay-submit>保存</button>
    </div>
</form>
<script>
    layui.use(['layer', 'form', 'table', 'admin', 'laydate', 'upload', 'laytpl'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var config = layui.config;
        var admin = layui.admin;
        var upload = layui.upload;
        let laydate = layui.laydate;
        let laytpl = layui.laytpl;
        let data = parentData.data
        if (data) {

        } else {
            admin.req('enterprise/sell/admin/order/getCustomers', {}, function (res) {
                let list = res.data
                admin.initDataSelect(list, {}, 'customerId', null, '客户名称', 'customerName')
                console.log('list', list)

                form.on('select(customerId)', function (d) {
                    $('#customerContactsId').empty()
                    form.render("select")
                    form.val('inquiryOrderInformationForm', {})
                    $('#agentName').val('')

                    if (d.value) {
                        admin.req('enterprise/sell/admin/customersInfo/list', {
                            id: d.value
                        }, function (res1) {
                            if (res1.data.length > 0) {
                                $('#agentName').val(res1.data[0].agentName)
                            }
                        })
                        admin.req('enterprise/sell/admin/contactInfo/list', {
                            selCustomerId: d.value
                        }, function (res1) {
                            let list1 = res1.data
                            console.log('list111', list1)
                            admin.initDataSelect(list1, {}, 'customerContactsId', null, '客户联系人')
                            form.on('select(customerContactsId)', function (d1) {
                                console.log(list1.find(v => v.id == d1.value))
                                $('#telephone').val(list1.find(v => v.id == d1.value)?.telephone)
                            })
                        })

                    }
                });
            })
            // admin.initDataSelect('enterprise/sell/admin/agent/list', {}, 'agentName', null, '所属渠道')
            admin.initDataSelect('user/admin/user/list', {}, 'checkerId', null, '询价审核人', 'username')
        }


        // form.on('select(customerId)',function (data){
        table.render({
            elem: '#inquiryOrderInformationTable',
            // url: config.base + `enterprise/sell/admin/customerProductCatalog/list?limit=9999&customerId=${data.value}`,
            // cellMinWidth: 100,
            page: false,
            limit: 999999,
            data: [],
            cols: [[
                {type: 'numbers', title: '序号'},
                , {field: 'extProductCode', align: 'center', title: '客户物料料号编码', width: 150}
                , {field: 'extProductName', align: 'center', title: '客户物料名称', width: 140}
                , {field: 'productTypeName', align: 'center', title: '内部物料类型', width: 140}
                , {field: 'skuCode', align: 'center', title: '内部物料料号', width: 140}
                , {field: 'unitName', align: 'center', title: '单位'}
                , {
                    field: 'number', align: 'center', title: '所需数量', templet: admin.setTableInput('number')
                }
                , {
                    field: 'danwei', align: 'center', title: '单价', templet: admin.setTableInput('danwei')
                }
                , {
                    field: 'packing',
                    align: 'center',
                    title: '是否需要包装',
                    width: 120,
                    templet: admin.setTableSelect('', [{value: true, label: '是'}, {value: false, label: '否'}])
                }
                , {field: 'packName', align: 'center', title: '包装方式'}
                , {field: 'remark', align: 'center', title: '备注说明'}
                , {align: 'center', toolbar: '#customerProductCatalogTableBar', title: '操作', width: 80}
            ]],
            done: function (res, curr, count) {
                console.log('请求成功:', res);
                admin.tableInputChange('inquiryOrderInformationTable')
            },
            error: function () {
                console.log('请求失败');
            }
        });
        // })
        table.on('submit(inquiryOrderInformationSubmit)', function (d) {
            console.log(d)
            return false
        })
        $('#Configure').click(function () {
            const id = $('#customerId').val()
            if (id) {
                admin.formOpen({
                    area: ['90%', '80%'],
                    offset: ['5%', '5%'],
                    title: '配置订单物料信息',
                    path: 'components/sell/trialOrderFormTable.html',
                    success: function () {
                        parentData.id = id
                        parentData.cacheList = [...table.cache['inquiryOrderInformationTable']]
                        // console.log(123,table.cache['inquiryOrderInformationTable'])
                    },
                    end: function () {
                        const newData = childData.list
                        const oldData = table.cache['inquiryOrderInformationTable']
                        const list =newData.map(v=>{
                            const obj = oldData.find(v1 => v1.id === v.id);
                            if (obj) {
                                return { ...obj };
                            }
                            return v;
                        })
                        table.reload('inquiryOrderInformationTable', {
                            data: list  // 设置新的数据
                        });
                    }
                })
            } else {
                layer.msg('请选择客户名称')
            }
        })
    })

</script>
